﻿<!doctype html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>发表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="我要换货" />
    <meta name="msapplication-TileColor" content="#090a0a">
    <link rel="stylesheet" href="__ROOT__/static/home/css/css_style.css">
    <script type="text/javascript" src="__ROOT__/static/plugins/jquery-3.2.1/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="__ROOT__/static/plugins/layer.mobile-v2.0/layer_mobile/layer.js"></script>
</head>
<style>
    /*选择图片样式*/
    .img{
        opacity:0;
        position: absolute;
        right: 0;
        top: 0;
        filter: alpha(opacity=0);
        cursor: pointer;
        font-size: 100px;
    }
</style>
<body class="grayBy">
<div class="search_community_header">
    <a href="{:url('home/Topics/TopicDetails', array('id' => $communityDetails.id))}"><span class="category_community"><img style="width: 10px;height: 20px;" src="__ROOT__/static/home/css/myorder/images/back.png"/></span></a>
    <span class="search_topics">编辑</span>
    <span class="search_topics_icon" onclick="submit()">发表</span>
</div>
<div class="feedback_box">
    <input type="hidden" id="community_id" value="{$community_id}"/>
    <div class="feed_title"><i class="sm_icon_edit"></i>编辑标题<b class="x_icon"></b></div>
    <div class="feed_box_a">
        <textarea id="literal_a" rows="2" cols="20" class="textarea_a_txt" placeholder="请输入您的标题..."></textarea>
        <span class="a"><font>0</font>/50</span>
    </div>
    <div class="feed_title"><i class="sm_icon_edit"></i>编辑内容<b class="x_icon"></b></div>
    <div class="feed_box_b">
        <textarea id="literal_b" rows="2" cols="20" class="textarea_b_txt" placeholder="请输入您的话题内容..."></textarea>
        <span class="b"><font>0</font>/500</span>
    </div>
    <div class="picture_title"><i class="picture_icon"></i>添加照片</div>
    <ul class="picture_list clearfix">
        <li id="li_img" onclick="addImg()">
            <div class="pic_box">
                <em id="image"></em>
                <i class="pic_icon"></i>
                <span>最多1张</span>
                <b class=""><i></i></b>
            </div>
        </li>
    </ul>
</div>
</body>
</html>
<script type="text/javascript">
    /*话题标题不超过50*/
    $(function () {
        var literal_a = document.getElementById('literal_a');
        var num1 = 50;
        literal_a.onkeyup = function () {
            if (this.value.length > 50) {
                //提示
                layer.open({
                    content: '亲！不能超过50个字符哦'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
                literal_a.value = literal_a.value.substring(0, 50);
            }
            else {
                num1 = 50 - this.value.length;
                $(".feed_box_a font").text(num1);
            }
        };
    });

    /*话题内容不超过200*/
    $(function () {
        var literal_b = document.getElementById('literal_b');
        var num2 = 500;
        literal_b.onkeyup = function () {
            if (this.value.length > 500) {
                //提示
                layer.open({
                    content: '亲！不能超过500个字符哦'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
                literal_b.value = literal_b.value.substring(0, 500);
            }
            else {
                num2 = 500 - this.value.length;
                $(".feed_box_b font").text(num2);
            }
        }
    });

    /*发表话题*/
    function submit(){
        var data ={};
        data.community_id = $('#community_id').val();
        data.title = $('#literal_a').val();
        data.topic_url = $('#topic_url').attr('src');
        data.topic_content = $('#literal_b').val();
        $.post("{:url('home/Topics/detailsTopic')}", data, function(callback){
            if(callback == 1){
                layer.open({
                    type: 2
                    ,content: '正在发表。。。'
                });
                setTimeout(funcName,500);
                function funcName() {
                    layer.open({
                        content: '发表成功！'
                        ,skin: 'msg'
                        ,time: 2 //2秒后自动关闭
                    });
                    setTimeout('window.location.href = "{:url(\'home/Topics/TopicDetails\', array(\'id\' => $community_id))}"', 1000);
                }
            }else if(callback == 'empty_title'){
                layer.open({
                    content: '标题不能为空！'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
            }else if(callback == 'empty_content'){
                layer.open({
                    content: '内容不能为空！'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
            }else if(callback == 'login'){
                layer.open({
                    content: '请登录！'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭Login
                });
                setTimeout('window.location.href = "{:url(\'home/Login/login\')}"', 1000);
            }else {
                layer.open({
                    content: '发表失败！'
                    ,skin: 'msg'
                    ,time: 2 //2秒后自动关闭
                });
            }
        });
    }

    /*上传图片*/
    function addImg(){
        layer.open({
            content:'<'+'form action="" method="post" id="upload" enctype="multipart/form-data"'+'>'+'<'+'input type="file" name="img" onchange="doUpload()" class="img"'+'>'+'选择图片'+'<'+'/form'+'>'
            ,skin: 'footer'
        });
        doUpload = function () {
            var formData = new FormData($('#upload')[0]);
            $.ajax({
                cache: false,
                type: "POST",
                url: "{:url('home/Topics/upload')}",
                data: formData,
                async: false,
                contentType: false,
                processData: false,
                success: function (data) {
                    //把上传路径写到数据库
                    var params = {};
                    params.topics_url = data;
                    $('#image').html('<img id="topic_url" src="'+'__ROOT__/'+params.topics_url+'" />');
                    layer.open({
                        content: '上传成功！'
                        ,skin: 'msg'
                        ,time: 2 //2秒后自动关闭Login
                    });
                }
            });
        };
    }
</script>
